﻿@{
    ViewBag.Title = "Bản đồ tiến độ điều tra";
    //Layout = "~/Views/Shared/_LayoutBusiness.cshtml";
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
}

<script type="text/javascript" src="http://viettelmap.vn/VTMapService/VTMapAPI?api=VTMap&type=main&k=dffc8675fc5d781ea8f0131f7d855565"></script>
<script type='text/javascript' src='~/Scripts/qlyHoTheoTienDo.js'></script>
<script src="~/Scripts/Airview-master/vendor/tooltip.min.js"></script>
<script src="~/Scripts/Airview-master/airview.min.js"></script>

<link href="@Url.Content("~/Content/styleMap_navbar.css")" rel="stylesheet" type="text/css" />

<script>
    @functions{
        public string GetAntiForgeryToken()
        {
            string cookieToken, formToken;
            AntiForgery.GetTokens(null, out cookieToken, out formToken);
            return cookieToken + "," + formToken;
        }
    }
    var strUrlGetAreaCode = '@Url.Action("GetAreaBoundPointByAreaCode", "Area")';
    var strUrlGetAllHouseID = '@Url.Action("GetAllHouseID", "Area")';
    var headers = {};
    $(document).ready(function () {

        $('#close1').click(function () {
            $('#Ghichu').hide();
        });

        $(document).on('click', '#map_view', function (e) {
            Checkclick("#map_view");
            alert(e.target.id);
            return false;
        });

        $(document).on('click', '#map_edit', function (e) {
            Checkclick("#map_edit");
            alert(e.target.id);
            return false;
        });
        $(document).on('click', '#map_draw', function (e) {
            Checkclick("#map_draw");
            alert(e.target.id);
            return false;
        });
        $(document).on('click', '#map_save', function (e) {
            alert(e.target.id);
            return false;
        });
        $(document).on('click', '#map_print', function (e) {
            alert(e.target.id);
            return false;
        });

        var serviceUrl = null;
        var strCommuneCode = null;

        serviceUrl = '@ViewBag.ServiceUrl';
        strCommuneCode = '@ViewBag.CommuneCode';
        loadMapToDraw("1", serviceUrl, strCommuneCode, "0");
        window.onload = function () {
            headers['VerificationToken'] = '@GetAntiForgeryToken()';
        }

        $('#printMapA4').click(function () {
            var strMaDiaBanGlobal = $('#selectDiBanDieuTra').val();
            var divPrint = $('<div id="divPrintMapA4" style="position: absolute; background-color:#ffffff;"></div>');
            $('body').css('overflow', 'hidden');
            var w = $(window).width();
            var h = $(window).height();
            divPrint.css('width', w);
            divPrint.css('height', h);
            divPrint.css('top', 0);
            divPrint.css('left', 0);
            divPrint.css('z-index', 999999);

            var frame = $('<iframe src="@Url.Action("getPrintA4TienDo")?strMaDiaBanGlobal=' + strMaDiaBanGlobal + '" frameborder="0"></iframe>');
            frame.css('width', w);
            frame.css('height', h);
            divPrint.html(frame);

            $('body').append(divPrint);

            return false;
        });

        $('#printMapA3').click(function () {
            var strMaDiaBanGlobal = $('#selectDiBanDieuTra').val();
            var divPrint = $('<div id="divPrintMapA3" style="position: absolute; background-color:#ffffff;"></div>');
            $('body').css('overflow', 'hidden');
            var w = $(window).width();
            var h = $(window).height();
            divPrint.css('width', w);
            divPrint.css('height', h);
            divPrint.css('top', 0);
            divPrint.css('left', 0);
            divPrint.css('z-index', 999999);

            var frame = $('<iframe src="@Url.Action("getPrintA3TienDo")?strMaDiaBanGlobal=' + strMaDiaBanGlobal + '" frameborder="0"></iframe>');
            frame.css('width', w);
            frame.css('height', h);
            divPrint.html(frame);

            $('body').append(divPrint);
            return false;
        });

    });

    var getContentMap = function () {
        var map = $('.map_content .olMapViewport');
        var w = $(window).width();
        return { width: w, html: map.html() };
    };
</script>

<div class="full-height-content">
    <div class="full-height-content-body" style="overflow:hidden;">
        <div id='map' class="map_content">
            <div id="Ghichu" class="list-group" style=" width: 180px; height: 130px; position: absolute; z-index: 1000; right:100px; ">
                <h5 class="list-group-item active" style="margin-top: 0px; text-align:center;">
                    Ghi chú
                    <button id="close1" type="button" class="close"></button>
                </h5>
                <a class="list-group-item">
                    <img src="../Images/Red.png" height="18" />  Chưa hoàn thành.
                </a>
                <a class="list-group-item">
                    <img src="../Images/Blue.png" height="18" />   Đã hoàn thành.
                </a>
            </div>
        </div>

        <div class="col-lg-12" style="position: absolute; clear: left; z-index: 1000; width:300px">
            <div class="Row" style="max-width: 300px;">
                <div class="col-lg-2">
                    <button id="printMapA4" title="In bản đồ A4">
                        <img src="../Images/map/A4.png" data-content="A4.png" width="25" id="map_print">
                    </button>
                </div>
                <div class="col-lg-2">
                    <button id="printMapA3" title="In bản đồ A3">
                        <img src="../Images/map/A3.png" data-content="A3.png" width="25" id="map_print">
                    </button>
                </div>
                <div class="col-lg-8">
                    @Html.DropDownList("selectDiBanDieuTra", ViewData["LIST_AREA"] as List<SelectListItem>, "Chọn địa bàn điều tra", new { @class = "form-control input-sm", style = "width:180px;" })
                </div>
            </div>
            <div id="ThongTin" class="Row" style="display: none; min-width: 200px; max-width: 300px;">
                <div class="modal-dialog">
                    <div class="modal-content" style="max-width: 300px; ">
                        <div class="Row" style="border-color: grey; text-align: center;font-size:larger;">
                            <b>Thông tin hộ dân cư</b>
                            <hr style="margin-top:0;margin-right:0px;">
                        </div>
                        <div class="Row" style="margin-left: 10px;">
                            <ul id="DBDT" style="font-size: 10px;"> </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>